{% extends "layout.html" %}
{% block css %}
<link rel="stylesheet" type="text/css" href="{{url('/assets/css/plugins/webuploader/webuploader.css')}}">
<link rel="stylesheet" type="text/css" href="{{url('/assets/css/plugins/webuploader/webuploader_excel.css')}}">
<style>
 .form-horizontal select.m-b{padding-top: 3px}
</style>
{% endblock %}
{% block content %}
{{ include('modalwindow.html') }}
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>学生管理 <small>学生列表</small></h5>
                        <div class="ibox-tools">
                            
                        </div>
                    </div>
                    <div class="col-xs-5 col-md-5">
                        <a {{W(5)}} href="{{url('/student/adddata.html')}}"><button type="button" class="btn btn-w-m btn-primary"><i class="fa fa-plus-circle"></i> 新增学生</button></a>
                        <button id="studentModalBut" data-toggle="modal" data-target="#studentExport" type="button" class="btn btn-w-m btn-success"><i class="fa fa-cloud-download"></i> 导出Excel</button>
                        <button {{W(9)}} data-toggle="modal" data-target="#studentImport" type="button"type="button" class="btn btn-w-m btn-info"><i class="fa fa-cloud-upload"></i> 导入Excel</button>
                    </div>
                    <div class="col-xs-6 col-md-6">
                        <div class="input-group m-b">
                            <div class="input-group-btn">
                                <button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button" aria-expanded="false">
                                   查询条件 <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu">
                                    <li><a data-name="" href="javascript:void(0);">模糊查询</a></li>
                                    <li><a data-name="1" href="javascript:void(0);">更多筛选</a></li>
                                </ul>
                            </div>
                            <input placeholder="学生学号 / 学生姓名 / 联系方式" type="text" class="form-control" name="" value=""  id='tablesSearch'>
                            <span class="input-group-btn"><button  id="searchButton" type="button" class="btn btn-primary">搜索</button></span>
                        </div>
                    </div>
                    
                    <div class="col-xs-12 col-md-12">
                        <!--更多筛选-->
                        <form class="form-horizontal" id="searchform" style="display:none;">
                            <div class="col-xs-5 col-md-5">
                                <div class="input-group col-md-10">
                                   <div class="input-group  m-b">
                                        <span class="input-group-addon">选择性别 <span class="fa fa-child"></span></span>
                                        <select class="form-control m-b" name="gender">
                                            <option value="">全部</option>
                                            <option value="1">女</option>
                                            <option value="2">男</option>
                                            <option value="3">保密</option>
                                        </select>
                                   </div>
                               </div>
                               <div class="input-group col-md-10">
                                   <div class="input-group  m-b">
                                        <span class="input-group-addon">选择导师 <span class="fa fa-user"></span></span>
                                        <select class="form-control m-b" name="tutor_id">
                                            <option value="">全部</option>
                                            {% if tutors|length > 0 %}
                                                {% for tutor in tutors %}
                                                    <option value="{{ tutor.id|e }}">[{{ tutor.number|e }}] {{ tutor.name|e }}</option>
                                                {% endfor %}
                                            {% endif %}
                                        </select>
                                   </div>
                                </div>
   
                            </div>
                            
                            <div class="col-xs-5 col-md-5">
                               
                              
                               <div class="input-group m-b col-md-12">
                                    <span class="input-group-addon">入学时间 <span class="fa fa-clock-o"></span></span>
                                    <input name="enrolment[]" placeholder="开始日期"  class="form-control layer-date" id="start">
                                </div>
                                <div class="input-group m-b col-md-12">
                                    <span class="input-group-addon">入学时间 <span class="fa fa-clock-o"></span></span>
                                    <input name="enrolment[]" placeholder="结束日期"  class="form-control layer-date" id="end">
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="ibox-content">
                        <table id="dataTables" class="table table-striped table-bordered table-hover">
                            <thead>
                                <tr>
                                    <th>编号</th>
                                    <th>学生学号</th>
                                    <th>学生姓名</th>
                                    <th>联系方式</th>
                                    <th>入学时间</th>
                                    <th>学生状态</th>
                                    <th {{W(13)}}>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                               
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th>编号</th>
                                    <th>学生学号</th>
                                    <th>学生姓名</th>
                                    <th>联系方式</th>
                                    <th>入学时间</th>
                                    <th>学生状态</th>
                                    <th {{W(13)}} >操作</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="ibox-content" style="display:none;" id="semesters-content">
        <table class="table">
            <thead><tr><th>学期ID</th><th>学期名称</th></tr></thead>
            <tbody>
                 {% if semesters|length > 0 %}
                    {% for semester in semesters %}
                        <tr><td><span class="badge badge-danger">{{semester.id|raw}}</span></td><td>{{semester.name|raw}}</td></tr>
                    {% endfor %}
                {% endif %}
            <tbody>
        </table>
    </div> 
     <div class="ibox-content" style="display:none;" id="tutors-content">
        <table class="table">
            <thead><tr><th>导师ID</th><th>导师名称</th></tr></thead>
            <tbody>
                 {% if tutors|length > 0 %}
                    {% for tutor in tutors %}
                        <tr><td><span class="badge badge-danger">{{tutor.id|raw}}</span></td><td>[{{tutor.number|raw}}] {{tutor.name|raw}}</td></tr>
                    {% endfor %}
                {% endif %}
            <tbody>
        </table>
    </div>  
</tbody>
</body>
{% endblock %}

{% block script %}
    <!-- Data Tables -->
    <script src="{{url('/assets/js/plugins/dataTables/jquery.dataTables.js')}}"></script>
    <script src="{{url('/assets/js/plugins/dataTables/dataTables.bootstrap.js')}}"></script>
    
    <!-- layerDate plugin javascript -->
    <script src="{{url('/assets/js/plugins/layer/laydate/laydate.js')}}"></script>
    
    <script src="{{url('/assets/js/plugins/layer/layer.min.js')}}"></script>
    <!-- Web Uploader -->
    <script type="text/javascript">
        var BASE_URL = "{{ url('/assets/js/plugins/webuploader')}}";
        var UPLOAD_URL = "{{ url('/student/upload.html')}}";
        var STUDENT_IMPORT_ACTION = "{{ url('/student/import.html')}}";  // 批量导入
        var STUDENT_REPEAT = "{{ url('/student/repeat.html')}}";
        var STUDENT_IMPORT_PROCESS = "{{ url('/student/process.html')}}";  // 获取动态进度
    </script>
    <script type="text/javascript" src="{{url('/assets/js/plugins/webuploader/webuploader.min.js')}}"></script>  
    <script type="text/javascript" src="{{ url('/assets/js/plugins/webuploader/siteuploader_excel.js')}}"></script>  
    <script type="text/javascript" src="{{url('/assets/js/student.import.js')}}"></script>  
    
    <script>
        $(document).ready(function () {
           
            var dataTablesFunction = function(){
                var dataTables = $('#dataTables').dataTable({
                     serverSide: true,
                     processing: false,
                     searching: true,
                     destroy: true, //摧毁一个已经存在的Datatables，然后创建一个新的
                     order: [[ 0 , "desc" ]],
                     ajax: {
                        type: "POST",
                        dataType: 'json',
                        url: "{{ url('/student/getdata.html') }}",
                        data: function(data){
                            var colvalue = $('#tablesSearch').val(); 
                            if(colvalue){  // 模糊查询
                                data.search.value = colvalue;
                            }else{
                                data.searchdata = $('#searchform').serialize(); // 精准查询
                            }
                        },
                        complete: function (xhr, ts) {
                            
                            //处理导出功能
                            var studentModalBut =  $('#studentModalBut');
                            studentModalBut.removeAttr('disabled');
                            if(!xhr.responseJSON.recordsTotal){
                                studentModalBut.attr('disabled','disabled');
                            };
                            
                            // 提示处理
                            $('[data-toggle="tooltip"]').tooltip();
                            $('.dataTables_filter').hide();
                        }
                    },
                    columns: [
                        {"data": "id"},
                        {"data": "number"},
                        {"data": "username"},
                        {"data": "my_mobile"},
                        {"data": "enrolment"},
                        {"data": "status","render":function(data){
                                var status = new Array();
                                status[1] = '在读';
                                status[2] = '开题';
                                status[3] = '结业';
                                status[4] = '毕业';
                                status[5] = '肄业';
                                status_text = status[data]
                                return status_text;
                        }},
                        {"data": 'action',
                            "render": function (data, type, full, meta) {
                                var editURL = "{{url('/student/update/"+data+".html')| raw}}";
                                var selectURL = "{{url('/elective/index/"+data+".html')| raw}}";  // 在线选课
                                var fractionURL = "{{url('/fraction/adddata/"+data+".html')| raw}}"; // 录入成绩
                                var proposalURL = "{{url('/proposal/index/"+data+".html')| raw}}"; // 学生开题
                                var defenseURL = "{{url('/defense/index/"+data+".html')| raw}}"; // 学生答辩
                                
                                var button = '<a {{W(13)}} data-toggle="tooltip" data-placement="right"  title="编辑"  href="'+editURL+'"><i class="fa fa-pencil-square-o text-navy"></i> | </a>';
                                button += '<a {{W(81)}} data-toggle="tooltip" data-placement="right" data-id="'+data+'" title="在线选课"  href="'+selectURL+'"><i class="fa fa-paper-plane text-navy"></i> | </a>';
                                // 录入成绩已迁移到已选课程录入成绩处，不能单方面指定课程成绩，而是对已选课的课程录入成绩
                                //button += '<a {{W(19)}} data-toggle="tooltip" data-placement="right" data-id="'+data+'" title="录入成绩"  href="'+fractionURL+'"><i class="fa fa-line-chart text-navy"></i> | </a>';
                                button += '<a {{W(12)}} data-toggle="tooltip" data-placement="right" data-id="'+data+'" title="删除" onClick="del(this)"  href="javascript:void(0);"><i class="glyphicon glyphicon-trash text-navy"></i> | </a>';
                                //button += '<a {{W(13)}} data-toggle="tooltip" data-placement="right" onClick="more('+data+')" title="更多"  href="javascript:void(0);"><i class="glyphicon glyphicon-zoom-in text-navy"></i> | </a>';
                                button += '<a {{W(142)}} data-toggle="tooltip" data-placement="right" title="开题"  href="'+proposalURL+'"><i class="fa fa-trophy text-navy"></i> | </a>';
                                button += '<a {{W(143)}} data-toggle="tooltip" data-placement="right" title="答辩"  href="'+defenseURL+'"><i class="fa fa-mortar-board text-navy"></i></a>';
                                return button;  
                            }
                        }
                    ],
                });
                
                return dataTables;
            };
       
            
            // 默认加载
            dataTablesFunction();
            
            // 点击搜索
            $('#searchButton').click(function(){
                var Tables = dataTablesFunction();
            });
            
            // 下拉框选择
            $('.dropdown-menu').find('a').click(function(){
                var column = $(this).attr("data-name");
                var text = $(this).html();
                $('.dropdown-toggle').html(text+' <span class="caret"></span>');
                if(column == '1'){  // 更多条件处理
                    $('#tablesSearch').attr('readonly','readonly');
                    $('#searchform').show();
                }else{
                    $('#tablesSearch').removeAttr('readonly');
                    $('#searchform').hide();
                }
            });
            
            
            //日期范围限制
            var start = {
                elem: '#start',
                format: 'YYYY-MM-DD',
                min: '2018-01-01', //设定最小日期为当前日期   laydate.now()
                max: '2099-06-16', //最大日期
                istime: false,
                istoday: false,
                choose: function (datas) {
                    end.min = datas; //开始日选好后，重置结束日的最小日期
                    end.start = datas //将结束日的初始值设定为开始日
                }
            };
            var end = {
                elem: '#end',
                format: 'YYYY-MM-DD',
                min: laydate.now(),
                max: '2099-06-16',
                istime: false,
                istoday: false,
                choose: function (datas) {
                    start.max = datas; //结束日选好后，重置开始日的最大日期
                }
            };
           
            laydate(start);
            laydate(end);
        });
        
         // 删除操作
        var del = function(that){
            var id = $(that).attr('data-id');
            var tr = $(that).parents("tr");
            tr.addClass('text-muted');
            layer.alert('你要进行删除ID：'+id+' 的记录吗？', {
                title:'操作提示',
                icon: 3,
                closeBtn: 1
            }, function(index){
                var delUrl = "{{ url('/student/del/"+id+".html')|raw}}";
                $.get( delUrl , function(data){
                    if(data.status){
                        tr.remove(); // 删除行
                        layer.msg( data.message , {icon: 1});
                    }
                },'json');
            });
            
            $('.layui-layer-close').on( 'click', function () {
                tr.removeClass('text-muted');
            });
        };
        
        // 更多信息
        var more = function(that){
            console.log(that);
        }
        
        
        // 查看学期ID
        var showSemesterID = function(){
            var semester_html= $('#semesters-content').html();
            layer.open({
              type: 1,
              skin: 'layui-layer-rim', //加上边框
              area: ['420px', '320px'], //宽高
              content: '<div class="ibox-content">'+semester_html+'</div>'
            });  
        };
        
        // 查看导师ID
        var showTutorID = function(){
            var tutors_html=$('#tutors-content').html();
            layer.open({
            type: 1,
            skin: 'layui-layer-rim', //加上边框
            area: ['420px', '320px'], //宽高
            content: '<div class="ibox-content">'+tutors_html+'</div>'
          });  
        };
    </script>
{% endblock %}